<nz-spin [nzSpinning]="isSpinning">
    <section class="information--container">
        <div class="information--content">
            <form nz-form [formGroup]="validateForm">
                <nz-form-item class="header-img--item">
                    <nz-form-label [nzSpan]="7">首页展示头像</nz-form-label>
                    <nz-form-control [nzSpan]="12">
                        <input formControlName="show_img" class="img-upload" id="show_img" type="file"
                               accept="image/jpeg,image/png"
                               name="imgfile"
                               multiple (change)="imgChange()" style="display: none">
                        <div class="header-img--container">
                            <img src="{{informationData.headerImg}}" alt="">
                        </div>
                        <button *ngIf="!isReadOnly" class="change-img--btn" nz-button nzType="primary"
                                (click)="changeImgFunc()">更换头像
                        </button>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item>
                    <nz-form-label [nzSpan]="7">名字</nz-form-label>
                    <nz-form-control [nzSpan]="12">
                        <input nz-input [readonly]="isReadOnly" formControlName="name" placeholder="请输入名字">
                        <nz-form-explain *ngIf="validateForm.get('name').dirty && validateForm.get('name').errors">
                            请输入名字!
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item>
                    <nz-form-label [nzSpan]="7">职位</nz-form-label>
                    <nz-form-control [nzSpan]="12">
                        <input nz-input [readonly]="isReadOnly" formControlName="position" placeholder="请输入职位">
                        <nz-form-explain
                                *ngIf="validateForm.get('position').dirty && validateForm.get('position').errors">请输入职位!
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <nz-form-item>
                    <nz-form-label [nzSpan]="7">个人简介</nz-form-label>
                    <nz-form-control [nzSpan]="12">
                        <textarea [readonly]="isReadOnly" formControlName="personalProfile" nz-input rows="4"
                                  placeholder="请输入个人简介"></textarea>
                        <nz-form-explain
                                *ngIf="validateForm.get('personalProfile').dirty && validateForm.get('personalProfile').errors">
                            请输入个人简介!
                        </nz-form-explain>
                    </nz-form-control>
                </nz-form-item>
                <!--<nz-form-item>-->
                <!--<nz-form-label [nzSpan]="7">技术栈</nz-form-label>-->
                <!--<nz-form-control [nzSpan]="12">-->
                <!--<textarea formControlName="personalProfile" nz-input rows="4" placeholder="请输入个人简介"></textarea>-->
                <!--<nz-form-explain-->
                <!--*ngIf="validateForm.get('personalProfile').dirty && validateForm.get('personalProfile').errors">-->
                <!--请输入个人简介!-->
                <!--</nz-form-explain>-->
                <!--</nz-form-control>-->
                <!--</nz-form-item>-->
                <nz-form-item>
                    <nz-form-control [nzOffset]="7" [nzSpan]="12">
                        <button nz-button nzType="primary" *ngIf="isReadOnly" (click)="editFormFunc()">修改</button>
                        <button nz-button nzType="primary" *ngIf="!isReadOnly" (click)="submitForm($event)">提交</button>
                        <button nz-button (click)="resetForm($event)">重置</button>
                    </nz-form-control>
                </nz-form-item>
            </form>
        </div>
    </section>
</nz-spin>